import React, { Component } from "react";
import { connect } from "react-redux";
import { HashRouter, Route, Switch } from "react-router-dom";
import {
  BASE_LINK,
  RACE_AREA_LINK,
  VIDEO_LINK,
  RECORD_LINK,
  MY_LINK,
  APPLY_LINK,
  LOGIN_LINK,
  REGISTER_LINK,
  USER_INFO_LINK,
  RECORD_WAR_SITUATION_LINK,
  RECORD_PERFORMANCE_LINK,
  RECORD_PERFORMANCE_DETAIL_LINK
} from "../actions/types.js";
import Nav from "./Nav.js";
import ScrollToTop from "./ScrollToTop";
import Index from "./Index.js";
import Record from "./Record.js";
import RecordWarSituation from "./RecordWarSituation.js";
import RecordPerformance from "./RecordPerformance.js";
import RecordPerformanceTable from "./RecordPerformanceTable.js";
import RaceArea from "./RaceArea.js";
import RaceAreaVideoDetail from "./RaceAreaVideoDetail.js";
import PersonalCenter from "./PersonalCenter.js";
import CompetitionApply from "./CompetitionApply.js";
import Login from "./Login.js";
import Register from "./Register.js";
import UserInfo from "./UserInfo.js";
import RequireAuth from "./RequireAuth"
class App extends Component {
  render() {
    return (
      <HashRouter basename={process.env.PUBLIC_URL}>
        <ScrollToTop>
          <Nav />
          <div className="App">
            <Switch>
              <Route path={RECORD_WAR_SITUATION_LINK} component={RecordWarSituation} />
              <Route path={`${RECORD_PERFORMANCE_DETAIL_LINK}/:id`} component={RequireAuth(RecordPerformanceTable)} />
              <Route path={RECORD_PERFORMANCE_LINK} component={RequireAuth(RecordPerformance)} />
              <Route path={RECORD_LINK} component={Record} />
              <Route path={`${RACE_AREA_LINK}/:area`} component={RaceArea} />
              <Route path={MY_LINK} component={PersonalCenter} />
              <Route path={APPLY_LINK} component={CompetitionApply} />
              <Route
                path={`${VIDEO_LINK}/:videoID`}
                component={RaceAreaVideoDetail}
              />
              <Route path={LOGIN_LINK} component={Login} />
              <Route path={REGISTER_LINK} component={Register} />
              <Route path={USER_INFO_LINK} component={UserInfo} />
              <Route path={BASE_LINK} component={Index} />
            </Switch>
          </div>
        </ScrollToTop>
      </HashRouter>
    );
  }
}
export default connect(null)(App);
// export default App;
